<template>
  <base-content>
    <template>
      <el-main><h2>订单列表</h2></el-main>
      <el-table :data="tableData.order_list" style="width: 100%">
        <el-table-column prop="id" label="订单id" />
        <el-table-column prop="insert_time" label="订单时间" />
        <el-table-column prop="user_id" label="用户id" />
        <el-table-column prop="product_id" label="商品id" />
        <el-table-column prop="order_amount" label="支付金额" />
        <el-table-column prop="consume_status" label="状态">
          <template slot-scope="scope">
            {{ scope.row.consume_status === 1 ? '已完成' : scope.row.consume_status === 2 ? '待消费' : '已消费' }}
          </template>
        </el-table-column>
        <el-table-column prop="pay_status" label="支付状态">
          <template slot-scope="scope">
            {{ scope.row.pay_status === 0 ? '未支付' : scope.row.pay_status === 1 ? '已支付' : '已支付(拼团失败)' }}
          </template>
        </el-table-column>
      </el-table>
      <el-main><h2>商品信息</h2></el-main>
      <el-table :data="tableData.product" style="width: 40%">
        <el-table-column prop="product_name" label="商品名称" />
        <el-table-column prop="product_attribute" label="规格" />
        <el-table-column prop="product_type" label="商品类别">
          <template slot-scope="scope">
            {{ scope.row.product_type === 1 ? '商品' : '服务' }}
          </template>
        </el-table-column>
      </el-table>
      <el-main><h2>核销列表</h2></el-main>
      <el-table :data="tableData.order_code_list" style="width: 100%">
        <el-table-column prop="id" label="id" />
        <el-table-column prop="user_id" label="用户id" />
        <el-table-column prop="order_id" label="订单id" />
        <el-table-column prop="code" label="核销码" />
        <el-table-column prop="code_status" label="核销码状态">
          <template slot-scope="scope">
            {{ scope.row.code_status === 0 ? '未核销' : '已核销' }}
          </template>
        </el-table-column>
        <el-table-column label="消费状态">
          <template slot-scope="scope">
            {{ scope.row.user_confirm_status === 0 ? '未确认' : '已确认' }}
          </template>
        </el-table-column>
        <el-table-column prop="consume_time" label="使用时间" />
        <el-table-column prop="user_confirm_time" label="用户确认时间" />
        <el-table-column prop="dept_name" label="使用机构门店" />
      </el-table>
    </template>
  </base-content>
</template>

<script>
import { getCollageByGroupId } from '@/api/groupbuy'

export default {
  data() {
    return {
      tableData: {
        order_code_list: [],
        order_list: [],
        product: []
      }
    }
  },
  mounted() {
    const query = this.$route.query
    this.query(query.id)
  },
  methods: {
    async query(id) {
      const result = await getCollageByGroupId({ id })
      if (result.code === '0') {
        const record = result.info.data
        this.tableData = record
        if (record) {
          const prodEntity = record.product
          const prods = [{ product_name: prodEntity.product_name, product_attribute: prodEntity.product_attribute, product_type: prodEntity.product_type }]
          this.tableData.product = prods
        }
      }
    }
  }
}
</script>

<style scoped>
.container {
  text-align: center;
  width: 100%;
  height: calc(100vh - 50px);
  background: rgb(227, 227, 227);
}
.container img {
  width: 800px;
}
.header {
  background: rgb(227, 227, 227);
  font-size: 30px;
  height: 200px;
  padding-top: 30px;
}
</style>
